{#
 This Source Code Form is subject to the terms of the Mozilla Public
 License, v. 2.0. If a copy of the MPL was not distributed with this
 file, You can obtain one at https://mozilla.org/MPL/2.0/.
#}

{% from "macros-protocol.html" import picto with context %}

{% set utm_params = '?utm_source=www.mozilla.org&utm_medium=referral&utm_campaign=fxdev-whatsnew' %}

<section>
  <div class="mzp-l-content mzp-t-content-lg">
    <div class="mzp-c-section-heading">
      <h2><img src="{{ static('img/logos/mdn/mdn-wordmark-white.svg') }}" alt="{{ ftl('firefox-developer-mdn-web-docs') }}" width="222" height="64"></h2>
      <p>{{ ftl('firefox-developer-resources-for-developers') }}</p>
    </div>
    <div class="mzp-l-columns mzp-t-columns-three">
      <div>
        <h3 class="mzp-u-title-xs"><a href="https://developer.mozilla.org/en-US/play/{{ utm_params }}" rel="external">{{ ftl('firefox-developer-mdn-playground') }}</a></h3>
        <p>{{ ftl('firefox-developer-mdn-write-test-and-share') }}</p>
      </div>
      <div>
        <h3 class="mzp-u-title-xs"><a href="https://developer.mozilla.org/en-US/blog/{{ utm_params }}" rel="external">{{ ftl('firefox-developer-mdn-blog') }}</a></h3>
        <p>{{ ftl('firefox-developer-mdn-unlock-the-world') }}</p>
      </div>
      <div>
        <h3 class="mzp-u-title-xs"><a href="https://developer.mozilla.org/en-US/plus/updates/{{ utm_params }}" rel="external">{{ ftl('firefox-developer-mdn-updates') }}</a></h3>
        <p>{{ ftl('firefox-developer-mdn-the-web-doesnt-have') }}</p>
      </div>
    </div>
  </div>
</section>
